<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns:th="http://www.thymeleaf.org">
<!-- 这个是静态，springmvc 读取到这个文件，结合我们的数据，重排布生成一个全新的html内容，返回给浏览器 -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport"
	content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

	<title>NB商城</title>

	<link href="assets/css/amazeui.css" rel="stylesheet" type="text/css" />
	<link href="assets/css/admin.css" rel="stylesheet" type="text/css" />

	<link href="basic/css/demo.css" rel="stylesheet" type="text/css" />

	<link href="css/hmstyle.css" rel="stylesheet" type="text/css" />
	<link href="css/skin.css" rel="stylesheet" type="text/css" />
	<script src="assets/js/jquery.min.js"></script>
	<script src="assets/js/amazeui.min.js"></script>
</head>

<body>
	<header th:replace="mall/header::header-user"></header>
	<nav th:replace="mall/header::header-search"></nav>
	<!--轮播 -->
	<div class="banner">
		<div class="am-slider am-slider-default scoll" data-am-flexslider
			id="demo-slider-0">
			<ul class="am-slides">
				<!-- 配置了轮播图则显示后台配置的轮播图 -->
				<th:block th:each="carousel : ${carousels}">
					<li class="banner1"><a th:href="@{${carousel.redirectUrl}}"
						href="introduction.html"> <img
							th:src="@{${carousel.carouselUrl}}" src="images/ad1.jpg" /></a></li>
				</th:block>
			</ul>
		</div>
		<div class="clear"></div>
	</div>
	<!-- 首页栏目 -->
	<div class="shopNav">
		<div class="slideall">
			<div class="long-title">
				<span class="all-goods">全部分类</span>
			</div>
			<!-- 首页栏目 -->
			<!--<div class="nav-cont">
                <ul>
                    <li class="index"><a href="#">首页</a></li>
                    <li class="qc"><a href="#">闪购</a></li>
                    <li class="qc"><a href="#">限时抢</a></li>
                    <li class="qc"><a href="#">团购</a></li>
                    <li class="qc last"><a href="#">大包装</a></li>
                </ul>
                <div class="nav-extra">
                    <i class="am-icon-user-secret am-icon-md nav-user"></i><b></b>我的福利
                    <i class="am-icon-angle-right" style="padding-left: 10px;"></i>
                </div>
            </div>			-->
			<!-- 全部分类 -->
			<div id="nav" class="navfull">
				<div class="area clearfix">
					<div class="category-content" id="guide_2">

						<div class="category">
							<ul class="category-list" id="js_climit_li">
								<th:block th:each="category : ${categories}">
									<li class="appliance js_toggle relative first">
										<div class="category-info">
											<h3 class="category-name b-category-name">
												<a class="ml-22" th:text="${category.categoryName}">点心/蛋糕</a>
											</h3>
											<em>&gt;</em>
										</div>
										<div class="menu-item menu-in top">
											<div class="area-in">
												<div class="area-bg">
													<div class="menu-srot">
														<div class="sort-side">
															<th:block
																th:each="secondLevelCategory : ${category.secondLevelCategoryVOS}">
																<dl class="dl-sort">
																	<dt>
																		<span th:text="${secondLevelCategory.categoryName}">蛋糕</span>
																	</dt>
																	<th:block
																		th:each="thirdLevelCategory : ${secondLevelCategory.thirdLevelCategoryVOS}">
																		<dd>
																			<a href="#"
																				th:href="@{'/search?goodsCategoryId='+${thirdLevelCategory.categoryId}}"><span
																				th:text="${thirdLevelCategory.categoryName}">蒸蛋糕</span></a>
																		</dd>
																	</th:block>
																</dl>
															</th:block>
														</div>
													</div>
												</div>
											</div>
										</div> <b class="arrow"></b>
									</li>
								</th:block>
							</ul>
						</div>
					</div>

				</div>
			</div>
		</div>
	</div>
	<div class="shopMainbg">
		<div class="shopMain" id="shopmain">

			<!--今日推荐 -->
			<div class="am-g am-g-fixed recommendation">
				<div class="clock am-u-sm-3">
					<img src="images/2016.png "></img>
					<p>
						今日<br>推荐
					</p>
				</div>
				<!-- 已配置热销商品则显示配置内容 -->
				<th:block th:each="hotGoodse : ${hotGoodses}">
					<div class="am-u-sm-4 am-u-lg-3 ">
						<div class="info">
							<h3 th:text="${hotGoodse.goodsName}">真的有鱼</h3>
							<h4 th:text="${hotGoodse.tag}">开年福利篇</h4>
						</div>
						<div class="recommendationMain one">
							<a th:href="@{'/detail?goodsId='+${hotGoodse.goodsId}}"
								href="introduction.html"> <img
								th:src="@{${hotGoodse.goodsCoverImg}}" src="images/tj.png " />
							</a>
						</div>
					</div>
				</th:block>
			</div>
			<div class="clear "></div>
			<!-- 新品上线-->
			<div class="am-container activity ">
				<div class="shopTitle ">
					<h4>新品上线</h4>
					<h3>新品上线 优惠享不停</h3>
					<!--<span class="more ">
                              <a href="# ">全部活动<i class="am-icon-angle-right" style="padding-left:10px ;"></i></a>
                        </span>-->
				</div>
				<div class="am-g am-g-fixed ">
					<th:block th:each="newGoods : ${newGoodses}">
						<div class="am-u-sm-3 ">
							<a th:href="@{'/detail?goodsId='+${newGoods.goodsId}}">
								<div class="icon-sale one "></div>
								<h4 th:text="${newGoods.sellingPrice}">优惠</h4>
								<div class="activityMain ">
									<img th:src="@{${newGoods.goodsCoverImg}}"
										src="images/activity1.jpg "></img>
								</div>
								<div class="info ">
									<h3 th:text="${newGoods.goodsName}">春节送礼优选</h3>
								</div>
							</a>
						</div>
					</th:block>
				</div>
			</div>
			<div class="clear "></div>

			<!-- 分类推荐 -->
			<div id="f1">
				<!--甜点-->
				<div class="am-container ">
					<div class="shopTitle ">
						<h4>推荐内容</h4>
						<h3>合适的东西再多也不担心</h3>
					</div>
				</div>

				<div class="am-g am-g-fixed floodFour">

					<th:block th:each="recommendGoods : ${recommendGoodses}">
						<div class="am-u-sm-7 am-u-md-4 text-two">
							<a th:href="@{'/detail?goodsId='+${recommendGoods.goodsId}}"
								href="# ">
								<div class="outer-con ">
									<div class="title " th:text="${recommendGoods.goodsName}">
										雪之恋和风大福</div>
									<div class="sub-title "
										th:text="${recommendGoods.sellingPrice}">¥13.8</div>
									<i class="am-icon-shopping-basket am-icon-md  seprate"></i>
								</div> <img th:src="@{${recommendGoods.goodsCoverImg}}"
								src="images/2.jpg" />
							</a>
						</div>
					</th:block>
					<div class="clear "></div>
				</div>

				<!-- 网站底部 -->
				<div th:replace="mall/footer::footer-fragment"></div>
			</div>
		</div>

		<script>
			window.jQuery || document.write('<script src="basic/js/jquery.min.js "><\/script>');



    </script>
		<script type="text/javascript">
if ($(window).width() < 640) {
	function autoScroll(obj) {
		$(obj).find("ul").animate({
			marginTop: "-39px"
		}, 500, function() {
			$(this).css({
				marginTop: "0px"
			}).find("li:first").appendTo(this);
		})
	}
	$(function() {
		setInterval('autoScroll(".demo")', 3000);
	})
}


    </script>
		<script type="text/javascript">
	(function() {
		$('.am-slider').flexslider();
	});
	$(document).ready(function() {
		$("li").hover(function() {
			$(".category-content .category-list li.first .menu-in").css("display", "none");
			$(".category-content .category-list li.first").removeClass("hover");
			$(this).addClass("hover");
			$(this).children("div.menu-in").css("display", "block")
		}, function() {
			$(this).removeClass("hover")
			$(this).children("div.menu-in").css("display", "none")
		});
	})



    </script>
		<script type="text/javascript " src="basic/js/quick_links.js "></script>
</body>

</html>